<form id="component-form-step-2" class="layui-form" action="" lay-filter="component-form-step-2">
    <div class="layui-form-item">
        {volist name="commParam.roles" id="role"}
        <div class="layui-inline">
            <label class="layui-form-label">{$role['name']}</label>
            <div class="layui-input-block">
                <input type="checkbox" name="role{$role['id']}" lay-skin="switch" lay-filter="roles" value="{$role['id']}">
            </div>
        </div>
        {/volist}
    </div>
</form>
<script>
    layui.use(['upload','form'], function(){
        var upload = layui.upload;
        var $ = layui.jquery;
        var form = layui.form;

        // 初始化一个VUE对象
        var add_step2 = new Vue({
            'el' : '#component-form-step-2',
            'data' : {
                // 角色
                roles : []
            },
            methods : {
                nodes : function () {
                    var self = this;
                    var result = [];
                    for(var k in commParam['roles']){
                        for(var kk in self.roles){
                            if(commParam['roles'][k]['id'] == self.roles[kk]){
                                for(var kkk in commParam['roles'][k]['nodes']){
                                    result.push(commParam['roles'][k]['nodes'][kkk]);
                                }
                                break;
                            }
                        }
                    }
                    return result;
                }
            },
            computed : {

            },
            watch : {

            }
        });

        (function (add_step2) {
            // 更新 lay-filter="test1" 所在容器内的全部表单状态
            form.render(null,'component-form-step-2');

            // 选择角色
            form.on('switch(roles)', function(ret){
                console.log(ret);
                // layer.tips('开关checked：'+ (this.checked ? 'true' : 'false'), ret.othis)
                // add_step1.lock = this.checked ? '1' : '0';
                var index = $.inArray(ret.value,add_step2.roles);
                if(this.checked){
                    index > -1 || add_step2.roles.push(ret.value);
                }else{
                    index > -1 && add_step2.roles.splice(index,1);
                }
            });
        })(add_step2);

        if(commParam['info'] !== null){
            // 编辑入参
            add_step2.roles = commParam['info']['roles'];

            var roleObject = {};
            for(var k in add_step2.roles){
                roleObject['role'+add_step2.roles[k]] = true;
            }
            console.log(roleObject);
            form.val("component-form-step-2", roleObject);
        }

        window.add_step2 = add_step2;
    });
</script>